/*
当打包构建应用时，JavaScript包会变得非常大,影响页面加载。
如果我们能把不同路由对应的组件分割成不同的代码块，然后当路由被访问的时候才加载对应组件，这样就更加高效了。
*/
//路由配置信息
export default [
  {
    path: '/center',
    component: () => import('@/pages/Center'),
    meta: { show: true },
    //二级路由组件
    children: [
      {
        path: 'myorder',
        component: () => import('@/pages/Center/myOrder')
      },
      {
        path: 'grouporder',
        component: () => import('@/pages/Center/groupOrder')
      },
      {
        path: '/center',
        redirect: '/center/myorder'
      }
    ]
  },
  {
    path: '/paysuccess',
    component: () => import('@/pages/PaySuccess'),
    meta: { show: true }
  },
  {
    path: '/pay',
    component: () => import('@/pages/Pay'),
    meta: { show: true },
    //路由独享守卫
    beforeEnter: (to, from, next) => {
      //去支付页面，必须从交易页而来
      if (from.path == '/trade' || from.path == '/') {
        next()
      } else {
        //其他路由组件而来，停留在当前路由
        next(false)
      }
    }
  },
  {
    path: '/trade',
    component: () => import('@/pages/Trade'),
    meta: { show: true },
    //路由独享守卫
    beforeEnter: (to, from, next) => {
      //去交易页面，必须从购物车而来
      if (from.path == '/shopcart' || from.path == '/') {
        next()
      } else {
        //其他路由组件而来，停留在当前路由
        next(false)
      }
    }
  },
  {
    path: '/shopcart',
    component: () => import('@/pages/ShopCart'),
    meta: { show: true }
  },
  {
    path: '/addcartsuccess',
    name: 'addcartsuccess',
    component: () => import('@/pages/AddCartSuccess'),
    meta: { show: true }
  },
  {
    path: '/detail/:skuid',
    component: () => import('@/pages/Detail'),
    meta: { show: true }
  },
  {
    path: '/home',
    //路由懒加载，用户访问这个页面时才加载
    component: () => import('@/pages/Home'),
    meta: { show: true }
  },
  //重定向到首页
  {
    path: '/',
    redirect: '/home'
  },
  {
    path: '/login',
    component: () => import('@/pages/Login'),
    meta: { show: false }
  },
  {
    path: '/register',
    component: () => import('@/pages/Register'),
    meta: { show: false }
  },
  {
    // 问号代表params值可传可不传
    path: '/search/:keyword?',
    component: () => import('@/pages/Search'),
    meta: { show: true },
    name: 'search',
    //路由组件能不能传递props数据?
    //可以，有3种写法
    //布尔值写法:params
    // props: true
    // 对象写法:额外的给路由组件传递一些props
    // props: { a: 1, b: 2 }
    //函数写法:可以把params参数、query参数，通过props传递给路由组件
    props: $route => {
      return {
        keyword: $route.params.keyword,
        k: $route.query.k
      }
    }
  }
]
